﻿<?php

require_once 'config/server.inc.php';
list($srva,$dba) = (isset($_GET['dba'])) ? explode(".",$_GET['dba']) : array("","");
list($srvb,$dbb) = (isset($_GET['dbb'])) ? explode(".",$_GET['dbb']) : array("","");


?><!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Database Compare | MODx enhanced</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Le styles -->
    <link href="css/bootstrap.css" rel="stylesheet">
    <link href="css/bootstrap-responsive.css" rel="stylesheet">
    <link href="css/docs.css" rel="stylesheet">
    <link href="css/mysqlcompare.css" rel="stylesheet">
    <link href="js/google-code-prettify/prettify.css" rel="stylesheet">

    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link rel="stylesheet" href="codemirror/lib/codemirror.css">
    <script src="codemirror/lib/codemirror.js"></script>
    <script src="codemirror/mode/xml/xml.js"></script>
    <script src="codemirror/lib/util/loadmode.js"></script>
	
    <!-- Le fav and touch icons -->
    <link rel="shortcut icon" href="img/favicon.ico">
  </head>
  <body>
  
    <div class="container">
		<!-- Masthead
		================================================== -->
		<header class="jumbotron subhead" id="overview">
		  <div id="topmessage">
		    <div class="alert hide">
              <button type="button" class="close" data-dismiss="alert">&times;</button>
              <p><strong>Well done!</strong> You successfully read this important alert message.</p>
            </div>
		  </div>
		  <h1 class="small">MySQL compare</h1>
		  <div class="subnav">
		   <!--
			<ul class="nav nav-pills">
			  <li class="dropdown">
				<a href="#" id="dropUndo" role="button" class="dropdown-toggle" data-toggle="dropdown">Undo<b class="caret"></b></a>
				<ul id="ulundolist" class="dropdown-menu" role="menu" aria-labelledby="dropUndo"></ul>
			  </li>
			  <li class="dropdown">
				  <a href="#" id="dropOpen" role="button" class="dropdown-toggle" data-toggle="dropdown">Open compare<b class="caret"></b></a>
				  <ul id="ulopenlist" class="dropdown-menu" role="menu" aria-labelledby="dropOpen"></ul>
              </li>
			  <li><a href="#">Save compare</a></li>
			  <li><a id="mnusettings" href="#">Settings</a></li>
			</ul>
			-->
		  </div>
		</header>

		<div class="row">
			<div class="span5">
				<div class="well">
				  <form name="formdba" class="form-horizontal">
					<fieldset>
					  <!-- <div class="control-group chkprefix">
						<div class="controls">
						  <input type="radio" name="dbastatus" id="dbastatus" value="unknown"/> unkown &nbsp; &nbsp; 
						  <input type="radio" name="dbastatus" id="dbastatus" value="productie" checked /> live &nbsp; &nbsp; 
						  <input type="radio" name="dbastatus" id="dbastatus" value="development"/> dev
						</div>
					  </div> -->
					  <div class="control-group">
						<label class="control-label" for="select11">Server A</label>
						<div class="controls">
						  <select id="srva"><?=$srv->srvoptions($srva)?></select>
						</div>
					  </div>
					  <div class="control-group">
						<label class="control-label" for="select01">Database A</label>
						<div class="controls">
						  <select id="dba"><?=$srv->si($srva)->dboptions($dba)?></select>
						</div>
					  </div>
					  <div class="control-group chkprefix hide">
						<label class="control-label" for="input05">Table prefix</label>
						<div class="controls">
						  <input type="text" id="prefixa" value=""/>
						</div>
					  </div>
					  <div class="control-group hide">
						<label class="control-label" for="select02">Table A</label>
						<div class="controls">
						  <select id="tbla"><option>Load DB A&amp;B first</option></select>
						</div>
					  </div>
					  <div class="control-group">
						<label class="control-label" for="backupa">Backup</label>
						<div class="controls">
						  <a class="btn btn-mini btn-success" id="btnbcka" href="#" title="Backup database (better safe than...)"><i class="icon-chevron-right icon-white"></i> Backup</a>
						  <a class="btn btn-mini btn-inverse" id="btnresa" href="#" title="Restore database from previous version"><i class="icon-share icon-white"></i> Restore</a>
						  <a class="btn btn-mini btn-danger" id="btndrpa" href="#" title="Remove all saved backup files"><i class="icon-remove icon-white"></i> Drop</a>
						</div>
					  </div>
					</fieldset>
				  </form>
				</div>
			</div>
			<div class="span2">
				<form class="form">
				  <fieldset>
					<div class="control-group">
					  <div class="controls">
						<label class="checkbox">
						  <input type="checkbox" id="chkUsePrefix" value="1" onchange="if(this.checked){$('.chkprefix').removeClass('hide')}else{$('.chkprefix').addClass('hide')}" />
						  Use table prefix
						</label>
					  </div>
					  <div class="controls">
						<label class="checkbox">
						  <input type="checkbox" id="chkHideSys" value="1" checked="true" />
						  Hide MODx internal tables
						</label>
					  </div>
					  <div class="controls">
					    <label class="checkbox">
						  <input type="checkbox" id="chkHideSame" value="1" />
						  Hide identical tables
						</label>
					  </div>
					  <div class="controls">
					    <label class="checkbox">
						  <input type="checkbox" id="chkHideIgnore" value="1" checked="true" />
						  Hide ignored tables
						</label>
					  </div>
					</div>
					<div class="btn-group" style="padding-left: 25px">
					  <a class="btn btn-primary" id="btncompare" href="#"><i class="icon-refresh icon-white"></i> Compare</a>
					  <a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
					  <ul class="dropdown-menu">
						<li><a id="btnrecompare" href="#"><i class="icon-refresh"></i> Re-evaluate</a></li>
						<!--
						<li class="divider"></li>
						<li><a href="#"><i class="icon-list"></i> Tables</a></li>
						<li><a href="#"><i class="icon-indent-left"></i> Rows</a></li>
						<li><a href="#"><i class="icon-edit"></i> Cell</a></li>
						<li class="divider"></li>
						<li><a href="#"><i class="i"></i> New task</a></li>
						-->
					  </ul>
					</div>
				  </fieldset>
				</form>
				<div class="progress progress-striped active">
					<div id="progress" class="bar" style="width: 0%;"></div>
				</div>
			</div>
			<div class="span5">
				<div class="well">
				  <form name="formdbb" class="form-horizontal">
					<fieldset>
					  <div class="control-group">
						<label class="control-label" for="select13">Server B</label>
						<div class="controls">
						  <select id="srvb"><?=$srv->srvoptions($srvb)?></select>
						</div>
					  </div>
					  <div class="control-group">
						<label class="control-label" for="select03">Database B</label>
						<div class="controls">
						  <select id="dbb"><?=$srv->si($srvb)->dboptions($dbb)?></select>
						</div>
					  </div>
					  <div class="control-group chkprefix hide">
						<label class="control-label" for="input06">Table prefix</label>
						<div class="controls">
						  <input type="text" id="prefixb" value=""/>
						</div>
					  </div>
					  <div class="control-group hide">
						<label class="control-label" for="select04">Table B</label>
						<div class="controls">
						  <select id="tblb"><option>Load DB A&amp;B first</option></select>
						</div>
					  </div>
					  <div class="control-group">
						<label class="control-label" for="backupb">Backup</label>
						<div class="controls">
						  <a class="btn btn-mini btn-success" id="btnbckb" href="#" title="Backup database (better safe than...)"><i class="icon-chevron-right icon-white"></i> Backup</a>
						  <a class="btn btn-mini btn-inverse" id="btnresb" href="#" title="Restore database from previous version"><i class="icon-share icon-white"></i> Restore</a>
						  <a class="btn btn-mini btn-danger" id="btndrpb" href="#" title="Remove all saved backup files"><i class="icon-remove icon-white"></i> Drop</a>
						</div>
					  </div>
					</fieldset>
				  </form>
				</div>
			</div>
		</div>

		<div class="row">
		  <div class="span12">
			<div id="myCarousel" class="carousel slide">
				<div class="carousel-inner">
					<!-- db result -->
					<div class="active item" id="result"></div>
					<!-- table result -->
					<div class="item" id="deepresult">
						<div id="lblchoosekey"></div>
						<div class="tabbable">
							<ul class="nav nav-tabs" id="deepTabs">
								<li><a id="lbldefinition" href="#definition" data-toggle="tab">Tabledefinition </a></li>
								<li><a id="lbldifferent" href="#different" data-toggle="tab">Different Records <span class="badge badge-important"></span></a></li>
								<li><a id="lblrecordsa" href="#recordsa" data-toggle="tab">Records in A <span class="badge badge-warning"></span></a></li>
								<li><a id="lblrecordsb" href="#recordsb" data-toggle="tab">Records in B <span class="badge badge-warning"></span></a></li>
								<li><a id="lblidentical" href="#identical" data-toggle="tab">Identical records <span class="badge badge-success"></span></a></li>
							</ul>
							<div class="tab-content">
								<div class="tab-pane" id="definition"></div>    
								<div class="tab-pane" id="different"></div>        
								<div class="tab-pane" id="recordsa"></div>
								<div class="tab-pane" id="recordsb"></div>
								<div class="tab-pane" id="identical"></div>        
							</div>
						</div>
				    </div>							
					<!-- row result -->
					<div class="item" id="rowresult"></div>
				</div>		
			</div>		
		  </div>
		</div>

     <!-- Footer
      ================================================== -->
      <footer class="footer">
        <p class="pull-right"><a href="#">Back to top</a></p>
        <p>Built in many private hours by <a href="http://twitter.com/ewaldvangemert" target="_blank">@ewaldvangemert</a>.</p>
        <p>Code licensed under the <a href="http://www.apache.org/licenses/LICENSE-2.0" target="_blank">Apache License v2.0</a>.</p>
        <p>Icons from <a href="http://glyphicons.com">Glyphicons Free</a>, licensed under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.</p>
      </footer>
	  
    </div><!-- /container -->

	<!-- Settings window -->
	<div id="mySettings" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="mySettingsLabel" aria-hidden="false">
	  <div class="modal-header">
		<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
		<h3>Settings</h3>
	  </div>
	  <div class="modal-body">
		<p>One fine body…</p>
		<div class="control-group warning">
		  <label class="control-label" for="inputUndo">Undo</label>
		  <div class="controls">
			<input type="checkbox" id="chkundo" value="1">
			<span class="help-inline">Enable undo function</span>
		  </div>
		</div>	
	  </div>
	  <div class="modal-footer">
		<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
		<a id="savesettings" href="#" class="btn btn-primary">Save changes</a>
	  </div>
	</div>
	
	<!-- Modal window -->
	<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button><h3>Modal header</h3></div><div class="modal-body"><p>One fine body…</p></div><div class="modal-footer"><button class="btn" data-dismiss="modal" aria-hidden="true">Close</button></div></div>
	
    <!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="js/jquery.js"></script>
    <script src="js/google-code-prettify/prettify.js"></script>
    <script src="js/bootstrap-dropdown.js"></script>
    <script src="js/bootstrap-transition.js"></script>
    <script src="js/bootstrap-modal.js"></script>
    .<script src="js/bootstrap-tab.js"></script>
    <script src="js/bootstrap-alert.js"></script>
    <script src="js/bootstrap-carousel.js"></script>
    <script src="js/bootstrap-tooltip.js"></script>
    <script src="js/undo.js<? echo "?".date('His') ?>"></script>  
    <script src="js/compare.js<? echo "?".date('His') ?>"></script>  
	<script>
	  <? if(isset($_GET['set'])){ ?>loadSettings('<?=$_GET['set']?>'); <? } ?>
	</script>
  </body>
 </html>